<div class="fuzzy-box"
     *ngIf="!hidden"
     [style.boxShadow]="boxShadow"
     [style.color]="theme.fuzzySearch.font"
     [style.background]="theme.fuzzySearch.background"
     (click)="$event.stopImmediatePropagation()">
  <input [style.background]="theme.fuzzySearch.background"
         [style.color]="theme.fuzzySearch.font"
         [style.border]="theme.fuzzySearch.border"
         autofocus #input type="text" name="search"
         [ngModel] (ngModelChange)="updateKeyword($event)">
  <ng-container *ngIf="searchQuery$ | async as query">
    <ngrev-quick-access-list
      *ngIf="searchResult$ | async as result"
      [theme]="theme"
      [style.display]="result.length ? 'block' : 'none'"
      [data]="result"
      [highlight]="query"
      (select)="select.next($event); hide()">
    </ngrev-quick-access-list>
  </ng-container>
</div>
